import React, { Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { enterPage } from 'utils/track';
import * as actions from '../actions/index';
import Backup from './backup/index';
import intl from '../../../../../../../../../locale';

const { pathResource } = window.FORCE;

class Root extends Component {
  componentDidMount() {
    const fullName = pathResource.fullName.split('/')[1]
      ? pathResource.fullName.split('/')[1].trim()
      : '';
    document.title = intl.get(
      {
        id: 'code-assets.settingsBackup.containers.root.RepositoryBackupFullnameCloudEffect',
        defaultMessage: '仓库备份 · {fullName} · 云效 Codeup',
      },
      { fullName },
    );
    enterPage('Repo-Settings-Backup');
  }

  render() {
    return (
      <>
        <div className="setting-main backup-setting-main">
          <div className="setting-main-right">
            <div className="backup-content">
              <div className="backup-content-tab">
                <Backup {...this.props} />
              </div>
            </div>
          </div>
        </div>
      </>
    );
  }
}

export default connect(
  (state) => ({
    ...state.project.projectSettings.backup,
    pageInfo: state.root.pageInfo,
  }),

  (dispatch) => bindActionCreators({ ...actions }, dispatch),
)(Root);
